cascading style sheets reference
סוגי מדיה ו- CSS
ההנחה המונחת ביסוד CSS1 היתה כי יש להסתכל על דפי האתר בשימוש מחשב אישי עם מסך. אבל יש עוד הרבה דרכים לגשת לדף האתר מאשר רק דרך מחשב ומסך. ולכל אחד מהמדיות השונות הללו יש את המאפיינים שלהם. הם יכולים יכולים להיות שחור-לבן, מוגבלים בגודלם, הם עשויים להיות "aural" - "שמיעתיים" וקרוא את תוכן דף האתר בקול רם. הם יכולים להיות מבוססים על טלויזיה, כמו WebTV.
בה אפשר לתפור דף סגנון להתאים למדיום המסויים שמשתמשים בו להציג את הדף. בתוך אותם דפי סגנון יכולים להיות לכם חלקים שונים עבור הדפסה, מכשירי אחיזה, מסכים וכו'. בחלק זה נבחן כיצד זה פועל.
ה- @media rule
ה- @media rule הוא תת קבוצה של דפי סגנון שהם ספציפיים לסוג מדיום מסויים או קבוצת מדיה.
@media rule מגדיר את המדיה או המדיום שאליו הוא קשור ואז מכיל מספר הצהרות, בדיוק כמו ההצהרות שאנו בדרך כלל מוצאים בדף הסגנון. ההצהרות הללו מתיישמות רק כאשר דף האתר המקושר לדף סגנון זה, מוצג בעזרת אחד מן המדיה, שאליה קשור ה- @media rule.
@media rules קלים מאוד לבנייה.
- הם מכילים את מילת המפתח @media
- רשימה של סוגי מדיה המופרדת ע"י פיסוק
- ההצהרות שיש ליישם לקבוצת מדיה זו, המוכלים
בתוך סוגריים מסולסלים "{" "}"
הצהרות אלה הן זהות להצהרות שאנו ראינו כבר בחלקים הקודמים.statements.
לדוגמא, הכלל הבא קשור לרקע לבן וצבע שחור לטקסט בגוף הדף כאשר הוא מודפס או כאשר הוא מוצג במכשיר אחיזה.
@media print, handheld {
background: white;
color: black
}
סוגי מדיה
CSS2 משרת את סוגי המדיה הבאים, כפי שמתואר בהמלצה המתאימה לכל המכשירים.
- all התקנה לבל רכיבים.
- aural מיועד לסינטיסייזר של דיבור.
- braille מיועד למכשירי משוב של ברייל (מגע).
- embossed מיועד למדפסות לדפי ברייל.
- handheld מיועד למכשירי אחיזה (מסך קטן, שחור-לבן, פס רוחב מוגבל).
- print מיועד לחומר אטום שמצוי בצורת דפים ועבור מסמכים שמוצגים על גבי מסך בצורה של קדם-הדפסה.
- projection מיעוד למייצגות במקרן, לדוגמא מקרנים או הדפסה בשקפים.
- screen מיועד בעיקר עבור מסכי מחשב צבעוני.
- tty מיועד עבור מדיה המשתמשת ברשת מאפיינים בגובה צליל קבוע, כמו teletypes, מסופים או מכשירים ניידים עם יכולות תצוגה מוגבלות. המחברים לא צריכים להשתמש ביחידות פיקסלים עם סוג המדיה "tty" media type.
- tv
מיועד למכשירים מסוג טלויזיה (רזולוציה נמוכה, צבע, עם יכולת גלילה
מוגבלת).
ייבוא מדיה ספציפי
בנוסף לכלל המדיה, CSS2 מאפשר ייבוא מותנה של דפי סגנון המבוסס על המדיום הנוכחי. זאת אומרת, שדף סגנון יכול להיות מיובא רק כאשר דף כלשהוא מוצג דרך מדיום מסויים.
כדי לעשות ייבוא מותנה של דף סגנון המבוסס על המדיום הנוכחי תיצרו כלל @import rule סטנדרטי, אבל תוסיפו את שמות המדיה שיגרום לדף הסגנון להיות מיובא ישירות אחרי הכלל ברשימה המופרדת ע"י פיסוק.
למשל, לייבא דף סגנון שנקרא monochrome.css css כאשר דף צריך להיות מודפס או מוצג על מכשיר אחיזה, תיצרו את כלל @import rule הבא:
@import url(monochrome.css) print, handheld
עבור הרחבה בנושא עיינו בחלק על סוגי כללים ב-CSS..
שלב הבא
בהמשך למאפיינים החדשים של CSS2 אנו נבדוק את "WebFonts" ב - CSS2.
|
